//提现订单管理

import React, { useEffect } from 'react';
import { gettixian } from '../../utils/api.tsx';
import { tixian, video_empoloyee } from '../../utils/types/home.ts';
import Toptitle from '../../Compon/Toptitle.tsx';
import Tbale from '../ContentManagement/content_components/Tbale.tsx';
import { Tag, Button } from 'antd';
import moment from 'moment';
import UploadFile from '../../Compon/UploadFile.tsx';
import Gooutfile from '../../Compon/file/Gooutfile.jsx';
export default function CashOrder() {
  useEffect(() => {
    gettixianlist();
  }, []);
  const [data, setData] = React.useState<tixian[]>([]);
  const [videoemployee, setvideoemploye] = React.useState<video_empoloyee[]>(
    [],
  );
  const gettixianlist = async () => {
    const data = await gettixian();
    setvideoemploye(data.data.data1);
    setData(data.data.data);
  };
  const columns = [
    {
      title: '序号',
      dataIndex: 'seq',
      key: 'seq',
      render: (text, record, index) => index + 1,
    },
    {
      title: 'ID',
      dataIndex: 'tixian_ID',
      key: 'tixian_ID',
      width: '1%',
    },
    {
      title: '订单号',
      dataIndex: '_id',
      key: '_id',
    },
    {
      title: '提现金额',
      dataIndex: 'tixian_money',
      key: 'tixian_money',
      render: (text) => <span>{text}元</span>,
    },
    {
      title: '提现状态',
      dataIndex: 'tixian_state',
      key: 'tixian_state',
      render: (text) => (
        <Tag color={text === 0 ? 'red' : text === 1 ? 'green' : 'blue'}>
          {text === 0 ? '待审核' : text === 1 ? '已通过' : '已拒绝'}
        </Tag>
      ),
    },
    {
      title: '用户名字',
      dataIndex: 'tixian_id',
      key: 'tixian_id',
      render: (text) => <div>{text.name}</div>,
    },
    {
      title: '头像',
      dataIndex: 'tixian_id',
      key: 'tixian_id',
      render: (text) => (
        <img
          src={text.image}
          alt=""
          style={{ width: '0.4rem', height: '0.4rem' }}
        />
      ),
    },
    {
      title: '手机号',
      dataIndex: 'tixian_id',
      key: 'tixian_id',
      render: (text) => <div>{text.tel}</div>,
    },
    {
      title: '交易时间',
      dataIndex: 'tixian_time',
      key: 'tixian_time',
      render: (text) => <div>{moment(text).format('YYYY-MM-DD HH:mm:ss')}</div>,
    },
    {
      title: '审核管理员',
      dataIndex: 'tixian_employee',
      key: 'tixian_employee',
      render: (text) => <div>{text.employee_name}</div>,
      filters: videoemployee.map((item) => {
        return { text: item.employee_name, value: item.employee_name };
      }),
      onFilter: (value, record) =>
        record.tixian_employee.employee_name === value,
      defaultFilteredValue: videoemployee.map((item) => item.employee_name),
    },
    {
      title: '操作',
      dataIndex: 'tixian_state',
      key: 'tixian_state',
      render: (text) => (
        <div>
          {text === 0 ? (
            <div>
              <Button type="primary">审核</Button>
              <Button>详情</Button>
            </div>
          ) : text === 1 ? (
            <Button type="primary">详情</Button>
          ) : (
            <Button type="primary" danger>
              详情
            </Button>
          )}
        </div>
      ),
    },
  ];
 
  return (
    <div>
      <Toptitle title="提现订单管理"></Toptitle>
      <Tbale data={data} colums={columns}></Tbale>
      <div style={{ display: 'flex', justifyContent: 'left' }}>
        <UploadFile
          name={'导入'}
          // url="http://localhost:3000/CustomerService/index/uploadFile"
        ></UploadFile>
        <Gooutfile data={data}></Gooutfile>
      </div>
    </div>
  );
}
